<div class="layui-fluid nepadmin-pad0 nepadmin-mar0 list0" id="list" lay-title="充值管理">
  <div class="layui-fluid">
    <div class="layui-row layui-col-space15">
      <div class="layui-col-md12">
        <div class="layui-card">
		  <div class="layui-card-header">充值管理</div>
          <div class="layui-card-body hxr-card-body" style="padding: 15px;">
			<div class="layui-form-item">
			  <label class="layui-form-label">充值金额</label>
			  <div class="layui-input-inline flex" style="width: 500px;">
				<input style="margin-right: 30px;" type="number" v-model="full" autocomplete="off" name="username" class="layui-input" placeholder="充值金额">
				<!-- <input style="margin-right: 30px;" type="number" v-model="reduce" autocomplete="off" name="username" class="layui-input" placeholder="赠送金额"> -->
				<button type="button" class="layui-btn" @click="add">添加</button>
			  </div>
			</div>
			<div class="layui-form-item" v-if="detail.value.length">
			  <label class="layui-form-label">已设置金额</label>
			  <div class="layui-input-inline" style="width: 500px;">
				<table class="layui-table">
				    <thead>
				      <tr>
				        <th>充值金额</th>
				        <!-- <th>赠送金额</th> -->
				        <th>操作</th>
				      </tr> 
				    </thead>
				    <tbody>
				      <tr v-for="(x,index) in detail.value">
				        <td>{{x.full}}</td>

				        <!-- <td>{{x.reduce}}</td> -->
				        <td>
							<a class="layui-btn layui-btn-danger layui-btn-xs" @click="del(index)"><i class="layui-icon layui-icon-delete"></i>删除</a>
						</td>
				      </tr>
				    </tbody>
				  </table>
			  </div>
			</div>
			<div class="layui-form-item">
			  <label class="layui-form-label">描述</label>
			  <div class="layui-input-inline" style="width: 500px;">
			      <textarea type="text" class="layui-textarea" v-model="detail.description" verify='require'></textarea>
			  </div>
			</div>
			<div class="layui-form-item">
			  <label class="layui-form-label">是否自定义充值金额</label>
			  <div class="layui-input-inline flex" style="width: 500px;">
				 <div class="layui-unselect layui-form-switch" :class="{'layui-form-onswitch':detail.status==0}" lay-skin="_switch" @click="radioF()"><em>{{detail.status==0?'是':'否'}}</em><i></i></div>
			  </div>
			</div>
			<div class="layui-form-item">
			  <label class="layui-form-label"></label>
			  <div class="layui-input-inline flex">
				<button type="button" class="layui-btn" style="width: 200px;" @click="save">保存</button>
			  </div>
			</div>
          </div>
        </div>
      </div>
    </div>
  </div>
</div>
<style type="text/css">
.layui-form-label{
	width: 130px;
}
</style>
<script>
  var vm=new Vue({
	  el:'#list',
	  data:{
		  detail:{
			 value:[],
			 status:0
		  },
		  full:'',
		  reduce:'',
		  old_detail:{}
	  },
	  mounted() {
		  var _this=this;
	  	layui.admin.ajax('recharges/list',{},1).then(function(res){
			res.data.value?res.data.value:res.data.value=[];
	  		_this.detail=res.data,_this.old_detail=JSON.stringify(res.data);

	  	});
	  },
	  methods:{
		  radioF(){//radio选择
		  	this.detail.status==1?this.detail.status=0:this.detail.status=1;
		  },
		  add(){
			  if(!this.full){
				  return layui.admin.ahint(2,'请输入充值金额');
			  }else if(this.full<0){
				  return layui.admin.ahint(2,'金额不能为负数');
			  }
			  /* if(!this.reduce){
				  return layui.admin.ahint(2,'请输入赠送金额');
			  } */
			  this.detail.value.push({
				  full:this.full
			  });
			  this.full='',this.reduce='';
		  },
		  save(){

			  var data=layui.admin.filter(this.detail,JSON.parse(this.old_detail)),_this=this;
				if(data){
					if(data.value)data.value=JSON.stringify(data.value);
					layui.admin.ajax('recharges/update',data).then(function(res){
						//_this.old_detail=JSON.stringify(_this.detail);
						layui.view.tab.refresh('/recharge/rechargelist');
					});
				}else{
					layer.msg('无修改');
				}
		  },
		  del(index){
			  this.detail.value.splice(index,1);
		  }
	  }
  })
</script>